@charset "utf-8";

@import "common";
@import "reset";
$width:100%;

header{
    border-bottom: 1px solid #DADADA;
    .search{
        position: relative;
        .logo{
            display: flex;
            justify-content: space-between;
            .main-c{
                width: 591px;
                position: relative;
                   .main-top{
                       max-width: 400px;
                       margin: 0 auto;
                       .top-line{
                           border-bottom: 3px solid #CCCCCC;
                           position: relative;
                           height: 40px;
                           .line-name{
                               color: #CCCCCC;
                               position: absolute;
                               top: 60px;
                               width: 80px;
                               margin-left: -40px;
                               text-align: center;
                               font-size: 14px;
                           }
                           .is-on{
                                color: #42cc63;
                             }  
                           .name-1{
                               left: 25%;
                           }
                           .name-2{
                               left: 50%;
                           }
                           .name-3{
                               left: 75%;
                           }
                           .red-line{
                               position: absolute;
                               height: 3px;
                               left: 0;
                               bottom: -3px;
                               background-color: #42cc63;
                               width: 37.5%;
                           }
                           .line-step2{
                               left: 132px;
                           }
                           .line-step3{
                               left: 250px;
                           }
                           .line-circular{
                               position: absolute;
                               bottom: -14px;
                               margin-left: -18px;
                               height: 30px;
                               width: 30px;
                               -webkit-border-radius: 50%;
                               border-radius: 50%;
                               background: #CCCCCC;
                               text-align: center;
                               line-height: 30px;
                               color: #FFFFFF;
                           }
                           .active{
                               background: #42cc63;
                           }
                       } 
                   }
               }
        }
    }
}
.content{
    width: $width;
    margin: 0 auto;
    border-bottom: 1px solid #CCCCCC;
    height: 1367px;
    .cashiner-box{
        max-width: 1318px;
        margin: 0 auto;
        padding-top: 46px;
        .message-title{
                width: $width;
                background: #efefef;
                height: 49px;
                line-height: 49px;
                span{
                    padding-left: 42px;
                    font-size: 18px;
                    display: inline-block;
                }
            }
        .cashiner-content-box{
            width: $width;
            margin: 0 auto;
            border: 1px solid #EFEFEF;
            margin-top: 6px;
            .cashiner-content{
                max-width: 1229px;
                margin: 0 auto;
                .title-text{
                    font-size: 18px;
                    padding-top: 40px;
                    padding-bottom: 56px;
                    line-height: 35px;
                    p{
                        &:nth-of-type(2){
                            font-size: 14px;
                            text-align: center;
                            color: #a09f9f;
                        }
                    }
                }
                form{
                    width:$width;
                    margin: 0 auto;
                    .zub{
                        border: 1px solid #DFDFDF;
                        padding: 22px 0 22px 53px;
                        label{
                            display: inline-block;
                            vertical-align: middle;
                            padding-left: 28px;
                        }
                        &:nth-of-type(2){
                            margin: 8px 0;
                        }
                        &:nth-of-type(3){
                            margin-bottom: 94px;
                        }
                    }
                }
            }
        }
        .affirm{
            width: $width;
            margin: 0 auto;
            text-align: right;
            padding-top: 48px;
            span{
                font-size: 16px;
            }
            .money{
                    color: #FF0000;
                }
            a{
                display: inline-block;
                background: #362f2f;
                width: 189px;
                height: 40px;
                text-align: center;
                color: #FFFFFF;
                border-radius: 5px;
                line-height: 40px;
            }
        }
    }
}
